import React, { Component } from 'react';
import './MyList.scss'
import pic from '../pic.jpg'

class MyList extends Component {
    constructor(props){
        super(props);
        this.state={
            classify:['综合','销量','新品','价格','筛选'],
            goods:[
                {pic,name:'COSME DECORTE 黛珂植物欣韵沁莹化妆水',previousPrice:'原价￥270',price:'活动价￥215'},
                {pic,name:'COSME DECORTE 黛珂植物欣韵沁莹化妆水',previousPrice:'原价￥270',price:'活动价￥215'},
                {pic,name:'COSME DECORTE 黛珂植物欣韵沁莹化妆水',previousPrice:'原价￥270',price:'活动价￥215'},
                {pic,name:'COSME DECORTE 黛珂植物欣韵沁莹化妆水',previousPrice:'原价￥270',price:'活动价￥215'},
            ]
        }
    }
    render() {
        return (
            <div className='goodlist'>
                <div className="classify">
                    {
                        this.state.classify.map((item)=>{
                            return(
                                <span>{item}</span>
                            )
                        })
                    }
                </div>
                <div className='goods'>
                    {
                        this.state.goods.map((item)=>{
                            return(
                                <div className="detail">
                                    <img src={item.pic} alt="" />
                                    <span>{item.name}</span>
                                    <span>{item.previousPrice}</span>
                                    <span>{item.price}</span>
                                </div>                           
                            )
                        })
                    }
                </div>
            </div>
        );
    }
}

export default MyList;